<template>
	<view class="search-page">
		<u-sticky bgColor="#fff" style="width: 750rpx;">
			<view class="item-tit">
				<view class="item-common ">
					<view>序号</view>
					<view>选择</view>
					<view>状态</view>
					<view>车牌</view>
				</view>
			</view>
		</u-sticky>
		<view class="item-common" v-for="(item, index) in lists" :key="item.id" @click="handleThis(item)">
			<view>{{index + 1}}</view>
			<view>
				<image src="../static/radius_a.png" mode="aspectFill" class="radius" v-if="item.id == car.id"></image>
				<image src="../static/radius.png" mode="aspectFill" class="radius" v-else></image>
			</view>
			<view>
				<image :src="item.positionImg" mode="aspectFill" class="radius"></image>
			</view>
			<view>{{item.operatorName}}</view>
		</view>
		<view class="" style="height: 200rpx;">
			
		</view>
		<btnBottom text="确 定" @onBtnClick="onBtnClick"></btnBottom>
	</view>
</template>

<script>
	import btnBottom from '../components/btnBottom.vue';
	export default {
		components: {
			btnBottom
		},
		props: {
			top: String
		},
		data() {
			return {
				plate: '',
				lists: [],
				car: {},
				noSelect: true,
			}
		},
		mounted() {
			var list = uni.getStorageSync('operatorHistory') || []
			for (var i in list) {
				this.lists.push(list[i])
			}

			console.log("operatorHistory", this.lists)
		},
		methods: {
			handleThis(msg) {
				this.car = msg
			},
			onBtnClick() {
				if (this.noSelect){
					this.noSelect = false
					this.$store.commit('SET_OPERATOR_INFO', this.car)
					uni.navigateBack({
					
					})
				}	
			}
		}
	}
</script>

<style scoped>
	.search-page {
		padding: 24rpx 24rpx 130rpx 24rpx;
	}

	.item-common {
		height: 88rpx;
		background: #FFFFFF;
		border: 1px solid #E5E5E6;
		border-radius: 8rpx;
		font-size: 28rpx;
		display: flex;
		align-items: center;
		margin-bottom: 8rpx;
	}

	.item-common view {
		width: 100rpx;
		height: 30rpx;
		line-height: 30rpx;
		text-align: center;
		border-right: 1px solid #E4E4E4;
	}

	.item-common view:nth-child(4),
	.item-common view:nth-child(5) {
		flex: 1;
	}

	.item-common view:nth-child(5) {
		border-right: 0;
	}

	.item-tit {
		width: 702rpx;
		padding-top: 14rpx;
		background: #F9F9FA;
	}

	.radius {
		width: 32rpx;
		height: 32rpx;
	}

	.btn-box {
		width: 750rpx;
		padding: 30rpx 0;
		position: fixed;
		left: 0;
		bottom: 0;
		background: #F9F9FA;
		z-index: 10;
	}
</style>